<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <%@ taglib prefix="sw" uri="http://java.sun.com/jsp/jstl/core" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Egicom</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link href="style.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="css/styles.css" />
<script language="javascript" type="text/javascript">

function choix(menu_gauche)
{

src = "";

if (menu_gauche.photos[0].checked)
src = "images/product_01.png";
if (menu_gauche.photos[1].checked)
src = "images/product_02.png";
if (menu_gauche.photos[2].checked)
src = "images/product_03.png";
if (menu_gauche.photos[3].checked)
src = "images/product_04.png";

def = "";

if (menu_gauche.photos[0].checked)
def = "KitGrafik";
if (menu_gauche.photos[1].checked)
def = "Zebu Francophone";
if (menu_gauche.photos[2].checked)
def = "EJS";
if (menu_gauche.photos[3].checked)
def = "Vacanceo";

siz = "";
/*
Copier les lignes suivante autant qu'il y a d'images (remplacer +1 par le chiffre adapter, il doivent être croissant de 0 à l'infini):
if (menu_gauche.photos[+1].checked)
siz = "width='500' height='400'";
*/
if (menu_gauche.photos[0].checked)
siz = "";
if (menu_gauche.photos[1].checked)
siz = "";
if (menu_gauche.photos[2].checked)
siz = "";
if (menu_gauche.photos[3].checked)
siz = "";

/*
Vous pouver modifier la taille de l'image : width='500' height='400'
					 la mise en forme du texte : <b><font size='+1'>
Attention à bien respecter les différentes syntaxes ' et "
*/
DinaImg = "<img src='" + src + "'" + siz +"><br><b>" + def + "</b>";
which2 = DinaImg
if (document.getElementById){
document.getElementById("photo").innerHTML=which2;
}
}
</script>
<script language="javascript" type="text/javascript">
function clearText(field) {
    if (field.defaultValue == field.value) field.value = '';
    else if (field.value == '') field.value = field.defaultValue;
}
</script>
<script language="javascript" type="text/javascript" src="scripts/mootools-1.2.1-core.js"></script>
<script language="javascript" type="text/javascript" src="scripts/mootools-1.2-more.js"></script>
<script language="javascript" type="text/javascript" src="scripts/slideitmoo-1.1.js"></script>
<script language="javascript" type="text/javascript">
window.addEvents({
    'domready': function () { /* thumbnails example , div containers */
        new SlideItMoo({
            overallContainer: 'SlideItMoo_outer',
            elementScrolled: 'SlideItMoo_inner',
            thumbsContainer: 'SlideItMoo_items',
            itemsVisible: 5,
            elemsSlide: 3,
            duration: 200,
            itemsSelector: '.SlideItMoo_element',
            itemWidth: 140,
            showControls: 1
        });
    },

});
</script>
</head>
<body>
<div id="wrapper">
  <div id="menu">
    <ul>
      <li><a href="#" class="current"><span></span>Accueil</a></li>
      
    </ul>
	
  </div>
  <!-- end of menu -->
  
  <div id="header_bar">
  
    <div id="header">
	
      <div class="right"></div>
      <h1><a href="#"> <img src="images/logo.png" alt="" /> <span>EGICOM V1.0</span> </a></h1>
	  
    </div>
	
    <div id="search_box">
      <form action="#" method="get">
	      
	      
        <input type="text" value="Produit..." name="q" size="10" id="searchfield" onfocus="clearText(this)" onblur="clearText(this)" />
		
        <input type="submit" name="Search" value="" alt="Search" id="searchbutton" />
		<select name="thelist" id="submit_btn" >
			<option>Catégorie</option>
		</select>
		
      </form>
	  <!-- <input type="submit" name="login" value="Se Connecter" alt="Login" id="submit_btn" />-->
    </div>
	<div id="panier">
		<input type="submit" name="panier" value="Panier" id="submit_btn" />
	 </div>
  </div>
  <!-- end of header_bar -->
  
  <div class="cleaner"></div>
  <div id="sidebar">
    <div class="sidebar_top"></div>
    <div class="sidebar_bottom"></div>
    <div class="sidebar_section">
      <h2>Membres</h2>
      <form action="#" method="get">
        <label>E-mail</label>
        <input type="text" value="" name="username" size="10" class="input_field" />
        <label>Mot-de-passe</label>
        <input type="password" value="" name="password" class="input_field" />
        <a href="#">S'inscrire</a>
        <input type="submit" name="login" value="Se Connecter" alt="Login" id="submit_btn" />
      </form>
      <div class="cleaner"></div>
    </div>
     <div class="sidebar_section">
      <h2>Categories</h2>
      <ul class="categories_list">
      	<sw:forEach items="${listeCategories}" var="o" >
        	<li><a href="#">${o.libeleCategorie}</a></li>
		</sw:forEach>
       
      </ul>
    </div>
   
  </div>
  <!-- end of sidebar -->
  <div id="content">
    <div id="latest_product_gallery">
      <h2>Nouveaux Produits</h2>
      <div id="SlideItMoo_outer">
        <div id="SlideItMoo_inner">
          <div id="SlideItMoo_items">
            <div class="SlideItMoo_element"> <a href="#"> <img src="images/product_01.png" alt="" /></a> </div>
            <div class="SlideItMoo_element"> <a href="#"> <img src="images/product_02.png" alt="" /></a> </div>
            <div class="SlideItMoo_element"> <a href="#"> <img src="images/product_03.png" alt="" /></a> </div>
            <div class="SlideItMoo_element"> <a href="#"> <img src="images/product_04.png" alt="" /></a> </div>
            <div class="SlideItMoo_element"> <a href="#"> <img src="images/product_05.png" alt="" /></a> </div>
            <div class="SlideItMoo_element"> <a href="#"> <img src="images/product_06.png" alt="" /></a> </div>
            <div class="SlideItMoo_element"> <a href="#"> <img src="images/product_07.png" alt="" /></a> </div>
            <div class="SlideItMoo_element"> <a href="#"> <img src="images/product_08.png" alt="" /></a> </div>
          </div>
        </div>
      </div>
    </div>
    <!-- end of latest_content_gallery -->
    <div class="content_section">
      <h2>Bienvenue à EGICOM</h2>
      
    </div>
    <div >
      <h2>Créer nouveau fournisseur : </h2>
	
	 
	 <form>
    	
       	<table>	
	  <tr>
	  <td>
	  
            <label for="billFName">First name:</label> </td>
          <td>  <input id="billFName" name="billFName" type="text" required="true"><span class="alert">*</span>
        </td>
		</tr>
		
		<tr>
	  <td>
            <label for="billLName">Last name:</label> </td>
          <td>  <input id="billLName" name="billLName" type="text" required="true"><span class="alert">*</span>
        </td>
		</tr>
		
		<tr>
	  <td>
            <label for="billAddress1">Address:</label> </td>
          <td>  <input id="billAddress1" name="billAddress1" type="text" required="true"><span class="alert">*</span>
        </td>
		</tr>
		
		<tr>
	  <td>
            <label for="billCity">City:</label> </td>
           <td> <input id="billCity" name="billCity" type="text" required="true"><span class="alert">*</span>
        </td>
		</tr>
		
		<tr>
	  <td>
            <label for="billCountry">Country:</label> </td>
           <td> <select id="billCountry" name="billCountry" onchange="javascript:startDisplay();" required="true">
                <option value="AR">Argentina</option>
                <option value="AW">Aruba</option>
                <option value="AU">Australia</option>
                <option value="BS">Bahamas</option>
                <option value="BB">Barbados</option>
                <option value="BE">Belgium</option>
                <option value="BM">Bermuda</option>
                <option value="BR">Brazil</option>
                <option value="CA">Canada</option>
                <option value="KY">Cayman Islands</option>
                <option value="CL">Chile</option>
                <option value="CN">China (People's Republic)</option>
                <option value="CX">Christmas Island</option>
                <option value="CR">Costa Rica</option>
                <option value="CY">Cyprus</option>
                <option value="DK">Denmark</option>
                <option value="EG">Egypt</option>
                <option value="FI">Finland</option>
                <option value="FR">France</option>
                <option value="DE">Germany</option>
                <option value="GR">Greece</option>
                <option value="GU">Guam</option>
         
    
 
            </select>
        </td>
		</tr>
		
		<tr>
	  <td>
            <label for="billZip">Post code:</label> </td>
         <td>   <input id="billZip" name="billZip" type="text" required="true"><span class="alert">*</span>
        </td>
		</tr>
		
		<tr>
	  <td> 
            <label for="billEqualShip">Ship to this address</label> </td>
          <td>  <input name="billEqualShip" type="checkbox" id="billEqualShip" value="Y" checked>
        </td>
		</tr>
		
		<tr>
	  <td>
            <label for="email">Email:</label> </td>
        <td>    <input id="email" name="email" type="email" required="true"><span class="alert">*</span>
        </td>
		</tr>
		
		<tr>
	  <td>
            <label for="phone">Phone:</label> </td>

          <td>  <input id="phone" name="phone" type="tel" required="true"><span class="alert">*</span>
        </td>
		</tr>
		<tr>
	  <td>
        <input type="submit" name="creer" value="Créer" id="submit_btn" /></td>
       <td><input type="submit" name="annuler" value="Annuler" id="submit_btn" />
        </td>
		</tr>
		</table>
    </form>
      
  </div>
  <!-- end of content -->
</div>
<!-- end of wrapper -->
 <div id="footer_wrapper">
  <div id="footer">
    
    Copyright &copy; 2013 <a href="#">EGICOM</a> | Designed by <a href="http://www.templatemo.com/">egicom</a></div>
  <!-- end of footer -->
</div> 
<!-- end of footer_wrapper -->


</body>
</html>
